<!--个人商品审核管理-->
<template>
	<section>
		<!--工具条-->
		<el-col :span="24" class="toolbar" style="display: flex;justify-content: space-between;margin-bottom: -10px;">
			<div>
				<p class="text">个人商品审核管理列表</p>
			</div>
			<el-form :inline="true" :model="filters" style="padding-right: 20px;">
				<el-form-item>
					<el-dropdown size="small" placement="bottom" trigger="click" @command="batchView" style="margin-left: 10px;">
					    <el-button type="primary" class="search-btn">
							查询
							<i class="el-icon-arrow-down el-icon--right"></i>
					    </el-button>
					    <el-dropdown-menu slot="dropdown">
						    <el-dropdown-item command="ship_View" style='width: 90px;margin-bottom: 5px;'>
							   <el-button type="primary" size="small" icon="el-icon-view">待审核</el-button>
							</el-dropdown-item>
							<el-dropdown-item command="rece_View" style='width: 90px;margin-bottom: 5px;'>
								<el-button type="primary" size="small" icon="el-icon-view">已通过</el-button>
							</el-dropdown-item>
							<el-dropdown-item command="carr_View" style='width: 90px;margin-bottom: 5px;'>
								<el-button type="primary" size="small" icon="el-icon-view">已拒绝</el-button>
							</el-dropdown-item>
							<el-dropdown-item command="cus_View">
								<el-button type="primary" size="small" icon="el-icon-view">自定义</el-button>
							</el-dropdown-item>
					    </el-dropdown-menu>
					</el-dropdown>
				</el-form-item>
			</el-form>
		</el-col>
		<!--列表-->
		<el-table :data="RoomList" highlight-current-row v-loading="loading" border @selection-change="selsChange" style="width: 100%;">
			<el-table-column prop="id" label="商品ID" width="73" align="center"></el-table-column>
			<el-table-column prop="categoryName" label="商品分类" align="center" width="80"></el-table-column>
			<el-table-column prop="goodsNumber" label="商品编号" align="center"></el-table-column>
			<el-table-column prop="goodsName" label="商品名称" align="center" width="300"></el-table-column>
			<el-table-column prop="goodsType" label="商品类型" align="center" :formatter="formatType"></el-table-column>
			<el-table-column prop="goodsState" label="是否上架" align="center" :formatter="formatState"></el-table-column>
			<el-table-column prop="createTime" label="创建时间" width="170" align="center"></el-table-column>
			<el-table-column label="操作" align="center" width="200">
				<template slot-scope="scope">
					<el-button type="primary" size="small" @click="handleEdit(scope.$index, scope.row)" icon="el-icon-edit">查看或审核</el-button>
				</template>
			</el-table-column>
		</el-table>
		<!--工具条-->
		<el-col :span="24" class="toolbar">
			<el-pagination background layout="total,sizes,prev, pager, next,jumper" @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-size="10" :total="total" style="float:right;">
			</el-pagination>
		</el-col>
		<!-- 编辑页面 -->
		<el-dialog title="商品审核" :visible.sync="editFormVisible" width="55%" :before-close="handleClose" style="margin-top: -100px;">
			<el-form label-width="105px">
				<el-form-item label="商品编号" prop="goodsNumber">
					<el-input v-model="editForm.goodsNumber" auto-complete="off" placeholder="商品编号" readonly></el-input>
				</el-form-item>
				<el-form-item label="商品分类" prop="categoryName">
					<el-input v-model="editForm.categoryName" auto-complete="off" placeholder="商品分类" readonly></el-input>
				</el-form-item>
				<el-form-item label="商品名称" prop="goodsName">
					<el-input v-model="editForm.goodsName" auto-complete="off" placeholder="商品名称" readonly></el-input>
				</el-form-item>
				<el-form-item label="商品类型" prop="goodsType">
					<el-input v-if="editForm.goodsType == '1'" v-model="this.Type0" auto-complete="off" placeholder="商品类型" readonly></el-input>
					<el-input v-if="editForm.goodsType == '2'" v-model="this.Type1" auto-complete="off" placeholder="商品类型" readonly></el-input>
				</el-form-item>
				<el-form-item label="商品销量" prop="saleCount">
					<el-input v-model="editForm.saleCount" auto-complete="off" placeholder="商品销量" readonly></el-input>
				</el-form-item>
				<el-form-item label="商品邮费" prop="expressPrice">
					<el-input v-model="editForm.expressPrice" auto-complete="off" placeholder="输入商品邮费" readonly></el-input>
				</el-form-item>
				<el-form-item label="商品投诉量" prop="problemCount">
					<el-input v-model="editForm.problemCount" auto-complete="off" placeholder="输入商品投诉量" readonly></el-input>
				</el-form-item>
				<el-form-item label="商品信息:">
					<el-table :data="Detaillist" style="width: 100%" row-key="id" border>
					    <el-table-column align="center" prop="id" label="规格ID:" width="80"></el-table-column>
					    <el-table-column align="center" prop="specsName" label="商品规格"></el-table-column>
					    <el-table-column align="center" prop="price" label="价格"></el-table-column>
						<el-table-column align="center" prop="stockTotal" label="库存问题"></el-table-column>
						<el-table-column align="center" prop="stock" label="当前库存"></el-table-column>
						<el-table-column align="center" prop="isDefault" label="是否默认" :formatter="formatDefault"></el-table-column>
					</el-table>
				</el-form-item>
			</el-form>
			<span slot="footer" class="dialog-footer">
				<el-button @click="editFormVisible = false">取 消</el-button>
				<el-button type="primary"  @click.native="editSubmit"  :loading="loading">通过</el-button>
				<el-button type="danger"   @click="Formloading = true" :loading="loading">拒绝</el-button>
			</span>
		</el-dialog>
		<!-- 不通过审核原因-->
		<el-dialog title="不通过审核原因" :visible.sync="Formloading" width="35%" :before-close="handleClose">
			<el-form :model="Form" label-width="105px" :rules="FormRules" ref="cusForm">
				<el-form-item label="不通过原因" prop="text">
					<el-input v-model="Form.text" auto-complete="off" placeholder="请输入不通过审核的原因" style="width: 220px;"></el-input>
				</el-form-item>
			</el-form>
			<span slot="footer" class="dialog-footer">
				<el-button @click="Formloading = false">取 消</el-button>
				<el-button type="primary"  @click.native="dangerSubmit" >确定</el-button>
			</span>
		</el-dialog>
		<!-- 自定义列表查询-->
		<el-dialog title="自定义列表查询" :visible.sync="cusdialog" width="35%" :before-close="handleClose">
			<el-form :model="cusForm" label-width="105px" ref="cusForm">
				<el-form-item label="商品ID" prop="id">
					<el-input v-model="cusForm.id" auto-complete="off" placeholder="请输入正确的商品ID" style="width: 220px;"></el-input>
				</el-form-item>
				<el-form-item label="商品编号" prop="goodsNumber">
					<el-input v-model="cusForm.goodsNumber" auto-complete="off" placeholder="请输入正确的商品编号" style="width: 220px;"></el-input>
				</el-form-item>
				<el-form-item label="商品类型" prop="goodsType">
					<el-radio-group v-model="cusForm.goodsType">
						<el-radio class="radio" :label="1">全新</el-radio>
						<el-radio class="radio" :label="2">二手</el-radio>
					</el-radio-group>
				</el-form-item>
				<el-form-item label="查询状态选择" prop="status">
					<el-radio-group v-model="cusForm.status">
						<el-radio class="radio" :label="1">通过</el-radio>
						<el-radio class="radio" :label="2">拒绝</el-radio>
					</el-radio-group>
				</el-form-item>
			</el-form>
			<span slot="footer" class="dialog-footer">
				<el-button @click="cusdialog = false">取 消</el-button>
				<el-button type="primary"  @click.native="cusSubmit" >查询</el-button>
			</span>
		</el-dialog>
	</section>
</template>

<script>
	import util from '../../../common/js/util'
	import wangeditor from '../../../components/addRoom.vue'
	import { 
		getNeedCheckList, 
		editNeedCheck,
		getGoodsUserDetail,
		Refreshtoken
	} from '../../../api/api';

	export default {
		inject:['reload'],
		data() {
			return {
				filters: {},
				RoomList: [],
				total: 0,
				page: 1,
				size:10,
				status:0,
				loading: false,
				editFormVisible:false,
				fileList: [],
				scope:'',
				sels: [],//列表选中列
				// 开始
				typeList:[],
				Detaillist:[],
				editForm:{},
				Type0:'全新',
				Type1:'二手',
				cusdialog:false,
				cusForm:{
					id:'',
					goodsNumber:'',
					goodsType:1,
					status:-1
				},
				Formloading:false,
				Form:{
					text:''
				},
				FormRules:{
					text: [{
						required: true,
						message: '请输入原因',
						trigger: 'blur'
					}],
				}
			}
		},
		mounted() {
			this.getList(0);
			this.queryInfo();
			this.timer = setInterval(() => {
			   setTimeout(this.queryInfo, 0)
			}, 600000)
		},
		methods: {
			// 设置定时器
			queryInfo() {
				var Token = sessionStorage.getItem('Token');
				var timestamp = new Date().getTime();
				let para = {token: Token,timestamp: timestamp};
				Refreshtoken(para).then((res) => {
					var res = res.data;
					if (res.code != 0) {
						this.$message({
							message: res.message,
							type: 'error'
						});
					} else {
						this.loading = false;
					}
				});
			},
			selsChange: function (sels) {
				this.sels = sels;
			},
			//商品类型
			formatType: function (row, column) {
				return row.goodsType == 1 ? '全新' : row.goodsType == 2 ? '二手' : '未知';
			},
			//是否上架
			formatState: function (row, column) {
				return row.goodsState == 1 ? '上架' : row.goodsState == 0 ? '下架' : '未知';
			},
			formatDefault:function(row, column) {
				return row.isDefault == 0 ? '否' : row.isDefault == 1 ? '是' : '未知';
			},
			handleClose(done) {
				this.$confirm('确认关闭？')
					.then(_ => {
						done();
					})
					.catch(_ => {});
			},
			handleSizeChange(val) {
				if (this.fies == 0) {
					var a = this.fies
				} else if(this.fies == 1){
					var a = this.fies
				} else if(this.fies == 2){
					var a = this.fies
				} else{
					var a = this.status
				}
				this.size = val;
				this.getList(a);
			},
			handleCurrentChange(val) {
				if (this.fies == 0) {
					var a = this.fies
				} else if(this.fies == 1){
					var a = this.fies
				} else if(this.fies == 2){
					var a = this.fies
				} else{
					var a = this.status
				}
				this.page = val;
				this.getList(a);
			},
			
			// 查看详情菜单
			handleEdit(index, row) {
				this.editFormVisible = true;
				var Token = sessionStorage.getItem('Token');
				var timestamp=new Date().getTime();
				var para = { token: Token, timestamp: timestamp, id:row.id };
				this.loading = true;
				getGoodsUserDetail(para).then((res) => {
					var res = res.data;
					if (res.code != 0) {
						this.$message({
							message: res.message,
							type: 'error'
						});
					} else {
						this.editForm = res.data;
						this.Detaillist = res.data.specsList
						this.loading = false;
					}
				});
			},
			// 审核通过
			editSubmit(){this.Review(1)},
			// 不通过审核
			dangerSubmit(){
				if (this.Form.text != '') {
					this.Review(2,this.Form.text)
				} else{
					this.$notify({ title: '警告', message: '请输入审核不通过的原因', type: 'warning' });
				}
			},
			Review(type,text){
				if (type == '1') {
					var checkState = type;
					var checkReason = ''
				} else if(type == '2'){
					var checkState = type;
					var checkReason = text
				}
				this.$confirm('确认提交吗？', '提示', {}).then(() => {
					this.loading = true;
					var Token = sessionStorage.getItem('Token');
					var timestamp = new Date().getTime();
					var para = {token: Token,timestamp: timestamp,id:this.editForm.id,checkState: type,checkReason:checkReason};	
					editNeedCheck(para).then((res) => {
						this.loading = false;
						this.$message({
							message: '提交成功',
							type: 'success'
						});
						this.editFormVisible = false;
						this.Formloading = false;
						this.getList(0);
					});
				});
			},
			//自定义查询列表
			batchView(command){
				switch (command) {
				  case "ship_View":
					this.shipView(0);
					this.fies = 0;
					break;
				  case "rece_View":
					this.receView(1);
					this.fies = 1;
					break;
				  case "carr_View":
					this.carrView(2);
					this.fies = 2;
					break;
				  case "cus_View":
				  this.cusdialog = true;
				  break;
				  
				}
			},
			shipView(ind) {this.getList(ind)},
			receView(ind) {this.getList(ind)},
			carrView(ind) {this.getList(ind)},
			// 通用列表查询
			getList:function(State){
				var Token = sessionStorage.getItem('Token');
				var timestamp = new Date().getTime();
				var para = {
					token: Token,
					curpage:this.page,
					pagesize:this.size,
					timestamp: timestamp,
					checkState:State
				};
				this.loading = true;
				getNeedCheckList(para).then((res) => {
					var res = res.data;
					if (res.code != 0) {
						this.$message({
							message: res.message,
							type: 'error'
						});
					} else {
						this.total = res.data.total;
						this.RoomList = res.data.list;
						this.loading = false;
					}
				});
			},
			//条件查询
			cusSubmit(){
				if (this.cusForm.status == '-1') {
					this.$notify({ title: '警告', message: '查询状态状态为必选项', type: 'warning' });
				}else{
					this.$refs.cusForm.validate((valid) => {
						if (valid) {
							this.$confirm('确认查询吗？', '提示', {}).then(() => {
								this.cusdialog = true;
								var Token = sessionStorage.getItem('Token');
								var timestamp = new Date().getTime();
								if (this.cusForm.id != '') {
									var para = {token: Token,timestamp: timestamp,curpage:this.page,pagesize:this.size,checkState:this.cusForm.status,id:this.cusForm.id};
								}else if(this.cusForm.goodsNumber != ''){
									var para = {token: Token,timestamp: timestamp,curpage:this.page,pagesize:this.size,checkState:this.cusForm.status,goodsNumber:this.cusForm.goodsNumber};
								}else if(this.cusForm.goodsType != ''){
									var para = {token: Token,timestamp: timestamp,curpage:this.page,pagesize:this.size,checkState:this.cusForm.status,goodsType:this.cusForm.goodsType};
								}
								getNeedCheckList(para).then((res) => {
									var res = res.data;
									if (res.code != 0) {
										this.$message({
											message: res.message,
											type: 'error'
										});
									} else {
										this.$message({
											message: '提交成功',
											type: 'success'
										});
										this.$refs['cusForm'].resetFields();
										this.cusdialog = false;
										this.total = res.data.total;
										this.RoomList = res.data.list;
										this.loading = false;
									}
								});
							});
						}
					});
				}
			},
		},
		beforeDestroy() {
		  clearInterval(this.timer);        
		  this.timer = null;
		}
	}

</script>

<style scoped>
.text{
	font-family: "arial, helvetica, sans-serif";
	font-size: 16px;
	color: #333;
	margin-top: 8px;
	margin-left: 10px;
	font-weight: 600;
}
</style>